<h4>{{i18n "discourse_subscriptions.admin.plans.title"}}</h4>

<form class="form-horizontal">
  <p>
    <label for="product">
      {{i18n "discourse_subscriptions.admin.products.product.name"}}
    </label>

    <Input
      @type="text"
      name="product_name"
      @value={{this.model.product.name}}
      disabled={{true}}
    />
  </p>

  <p>
    <label for="name">
      {{i18n "discourse_subscriptions.admin.plans.plan.nickname"}}
    </label>

    <Input @type="text" name="name" @value={{this.model.plan.nickname}} />

    <div class="control-instructions">
      {{i18n "discourse_subscriptions.admin.plans.plan.nickname_help"}}
    </div>
  </p>

  <p>
    <label for="interval">
      {{i18n "discourse_subscriptions.admin.plans.plan.group"}}
    </label>

    <ComboBox
      @valueProperty="name"
      @content={{this.availableGroups}}
      @value={{this.selectedGroup}}
      @onChange={{action (mut this.model.plan.metadata.group_name)}}
    />

    <div class="control-instructions">
      {{i18n "discourse_subscriptions.admin.plans.plan.group_help"}}
    </div>
  </p>

  <p>
    <label for="amount">
      {{i18n "discourse_subscriptions.admin.plans.plan.amount"}}
    </label>

    {{#if this.planFieldDisabled}}
      <Input
        class="plan-amount plan-currency"
        disabled={{true}}
        @value={{this.model.plan.currency}}
      />
    {{else}}
      <ComboBox
        @disabled={{this.planFieldDisabled}}
        @content={{this.currencies}}
        @value={{this.model.plan.currency}}
        @onChange={{action (mut this.model.plan.currency)}}
      />
    {{/if}}

    <Input
      class="plan-amount"
      @type="text"
      name="name"
      @value={{this.model.plan.amountDollars}}
      disabled={{this.planFieldDisabled}}
    />
  </p>

  <p>
    <label for="recurring">
      {{i18n "discourse_subscriptions.admin.plans.plan.recurring"}}
    </label>

    {{#if this.planFieldDisabled}}
      <Input
        @type="checkbox"
        name="recurring"
        @checked={{this.model.plan.isRecurring}}
        disabled={{true}}
      />
    {{else}}
      <Input
        @type="checkbox"
        name="recurring"
        @checked={{this.model.plan.isRecurring}}
        {{on "change" (action "changeRecurring")}}
      />
    {{/if}}
  </p>

  {{#if this.model.plan.isRecurring}}
    <p>
      <label for="interval">
        {{i18n "discourse_subscriptions.admin.plans.plan.interval"}}
      </label>

      {{#if this.planFieldDisabled}}
        <Input disabled={{true}} @value={{this.selectedInterval}} />
      {{else}}
        <ComboBox
          @valueProperty="name"
          @content={{this.availableIntervals}}
          @value={{this.selectedInterval}}
          @onChange={{action (mut this.selectedInterval)}}
        />
      {{/if}}
    </p>

    <p>
      <label for="trial">
        {{i18n "discourse_subscriptions.admin.plans.plan.trial"}}
        ({{i18n "discourse_subscriptions.optional"}})
      </label>

      <Input
        @type="text"
        name="trial"
        @value={{this.model.plan.trial_period_days}}
      />

      <div class="control-instructions">
        {{i18n "discourse_subscriptions.admin.plans.plan.trial_help"}}
      </div>
    </p>
  {{/if}}

  <p>
    <label for="active">
      {{i18n "discourse_subscriptions.admin.plans.plan.active"}}
    </label>
    <Input @type="checkbox" name="active" @checked={{this.model.plan.active}} />
  </p>
</form>

<section>
  <hr />

  <p class="control-instructions">
    {{i18n "discourse_subscriptions.admin.plans.operations.create_help"}}
  </p>

  <div class="pull-right">
    {{#if this.model.plan.isNew}}
      <DButton
        @label="discourse_subscriptions.admin.plans.operations.create"
        @action={{action "createPlan"}}
        @icon="plus"
        class="btn btn-primary"
      />
    {{else}}
      <DButton
        @label="discourse_subscriptions.admin.plans.operations.update"
        @action={{action "updatePlan"}}
        @icon="check"
        class="btn btn-primary"
      />
    {{/if}}
  </div>
</section>